/*
 * @Author: Kilims Ye
 * @LastEditors: Kilims Ye
 * @Date: 2020-06-28 09:02:41
 * @LastEditTime: 2021-03-31 09:45:39
 * @Description:
 */
const {
  override,
  addPostcssPlugins,
  fixBabelImports,
  addLessLoader,
  addWebpackAlias,
  disableChunk,
  useBabelRc,
  addBundleVisualizer,
  disableEsLint,
  addWebpackPlugin,
} = require("customize-cra");
const theme = require("./antd-theme");
const path = require("path");
const rewireUglifyjs = require("react-app-rewire-uglifyjs");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
const LodashWebpackPlugin = require("lodash-webpack-plugin");
const HtmlWebpackExternalsPlugin = require("html-webpack-externals-plugin");

let version = "v0.0.1";

//生产环境去除console.* functions
const dropConsole = () => {
  return (config) => {
    if (config.optimization.minimizer) {
      config.optimization.minimizer.forEach((minimizer) => {
        if (minimizer.constructor.name === "TerserPlugin") {
          minimizer.options.terserOptions.compress.drop_console = true;
        }
      });
    }
    config.optimization.splitChunks = {
      cacheGroups: {
      },
    };
    return config;
  };
};

// 打包配置
const addCustomize = () => (config) => {
  if (process.env.NODE_ENV === "production") {
    // 关闭sourceMap
    config.devtool = false;
    // Analyze bundle
    config.plugins.push(
      new BundleAnalyzerPlugin({
        analyzerMode: "static", //输出静态报告文件report.html，而不是启动一个web服务
      })
    );
    config.output.filename = `static/js/[name].[contenthash:8].${version}.js`;
    config.output.chunkFilename = `static/js/[name].[contenthash:8].${version}.chunk.js`;
  }
  return config;
};

module.exports = override(
  fixBabelImports("antd", {
    libraryName: "antd",
    libraryDirectory: "es",
    style: true,
  }),
  fixBabelImports("antd-mobile", {
    libraryName: "antd-mobile",
    libraryDirectory: "es",
    style: true,
  }),
  addLessLoader({
    lessOptions: {
      javascriptEnabled: true,
      modifyVars: theme,
    },
  }),
  // ant theme :
  // https://ant.design/docs/react/customize-theme-cn
  // https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less

  // ant-mobile theme:
  // https://mobile.ant.design/docs/react/customize-theme-cn
  // https://github.com/ant-design/ant-design-mobile/blob/master/components/style/themes/default.less
  addWebpackAlias({
    ["@context"]: path.resolve(__dirname, "src/context"),
    ["@components"]: path.resolve(__dirname, "src/components"),
    ["@api"]: path.resolve(__dirname, "src/services"),
    ["@utils"]: path.resolve(__dirname, "src/utils"),
    ["@pages"]: path.resolve(__dirname, "src/pages"),
    ["@routes"]: path.resolve(__dirname, "src/routes"),
    ["@assets"]: path.resolve(__dirname, "src/assets"),
    ["@actions"]: path.resolve(__dirname, "src/store/actions"),
    ["@statics"]: path.resolve(__dirname, "src/statics"),
  }),
  addWebpackPlugin(
    new MiniCssExtractPlugin({
      filename: `static/css/[name].[contenthash:8].${version}.css`,
      chunkFilename: `static/css/[name].[contenthash:8].${version}.chunk.css`,
      ignoreOrder: true,
    }),
    new LodashWebpackPlugin({ collections: true, paths: true }) // 美化控制台
  ),
  useBabelRc(),
  disableChunk(),
  disableEsLint(),
  dropConsole(),
  addCustomize(),
  addPostcssPlugins([
    require("postcss-pxtorem")({ rootValue: 37.5, propList: ["*"], minPixelValue: 2, selectorBlackList: [] }),
  ]),
  // addPostcssPlugins([require('postcss-pxtorem')({ rootValue: 37.5, propList: ['*'], minPixelValue: 2, selectorBlackList: ['am-', 'ant-'] })]),
  rewireUglifyjs,
  process.env.BUNDLE_VISUALIZE === 1 && addBundleVisualizer()
);
